<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2023/5/9
  Time: 7:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main">
        <div class="layui-tab layui-tab-card">
            <ul class="layui-tab-title">
                <li class="layui-this">个人资料</li>
                <li>修改密码</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <form class="layui-form" action="" lay-filter="userInfo-filter">
                        <div class="layui-form-item">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-block">
                                <input type="text" name="nickName" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">性别</label>
                            <div class="layui-input-block">
                                <input type="radio" name="gender" value="1" title="男" checked="">
                                <input type="radio" name="gender" value="0" title="女">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">生日</label>
                            <div class="layui-input-inline">
                                <input type="date" name="birthday" id="birthday"
                                       lay-verify="date"  placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">邮箱</label>
                            <div class="layui-input-block">
                                <input type="email" name="email" id="email" lay-verify="required" placeholder="请输入邮箱" value="" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">余额</label>
                            <div class="layui-input-block">
                                <input type="number" name="money" id="money"
                                       lay-verify="required" placeholder="请输入余额" value="" class="layui-input" disabled="true">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" lay-event="changeInfo">确认修改</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="layui-tab-item">
                    <form class="layui-form" action="" lay-filter="pas-filter">
                        <div class="layui-form-item">
                            <label class="layui-form-label">密码</label>
                            <div class="layui-input-inline">
                                <input type="password" name="password" placeholder="请输入旧密码" lay-verify="required" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">新的密码</label>
                            <div class="layui-input-block">
                                <input type="password" name="password1" lay-verify="required" lay-reqtext="新的密码不能为空" placeholder="请输入新的密码" value="" class="layui-input">
                                <tip>密码长度不小于8位，包含“数字,大写字母,小写字母”中的至少三种~</tip>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">确认密码</label>
                            <div class="layui-input-block">
                                <input type="password" name="password2" lay-verify="required" lay-reqtext="新的密码不能为空" placeholder="请输入新的密码" value="" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="changePwdBtn" lay-event="changePas">确认修改</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['form', 'util'], function(){
        var form = layui.form;
        var layer = layui.layer;
        var util = layui.util;
        var $ = layui.$;
        var user='${loginUser}';

        user=JSON.parse(user);
        console.log(user);

        // 密码格式检查
        function checkPassword(pwd) {
            // 格式判断
            var regUpLetter = /[A-Z]/
            var regLowLetter = /[a-z]/
            var regNumber = /[0-9]/
            var complex = 0;
            if (regUpLetter.test(pwd)) {
                ++complex;
            }
            if (regLowLetter.test(pwd)) {
                ++complex;
            }
            if (regNumber.test(pwd)) {
                ++complex;
            }
            return !(complex < 3 || pwd.length < 8);
        }

        form.val('userInfo-filter', {
            "userId":user.userId,
            "gender":user.gender,
            "nickName": user.nickName,
            "money":user.money,
            "email":user.email
        });
        $('#birthday').val(util.toDateString(user.birthday, 'yyyy-MM-dd'));
        form.val('pas-filter',{
            "password":user.password
        })

        // // 自定义验证规则
        // form.verify({
        //     pass: [
        //         /^[\S]{6,12}$/,
        //         '密码必须6到12位，且不能出现空格'
        //     ]
        // });
        /**
         * 初始化表单，要加上，不然刷新部分组件可能会不加载
         */
        form.render();
        // 指定开关事件
        // 监听提交

        //监听提交
        form.on('submit(saveBtn)', function (data) {
            user.nickName=data.field.nickName;
            user.birthday=data.field.birthday;
            user.gender=data.field.gender;
            user.email=data.field.email;
            console.log(user);
            var index = layer.alert("是否确认修改该用户", {
                title: '修改信息'
            }, function () {
                $.ajax({
                    url: "/user/updateUser",
                    data: JSON.stringify(user),
                    contentType: "application/json;charset=UTF-8",
                    dataType: "json",
                    type: "POST",
                    success:function(res){
                        if(res.status===200){
                            layer.msg(res.message,{icon:1,time:1000});
                            layer.close(index);
                            // parent.layer.close(parentIndex);
                        }else{
                            layer.msg(res.message,{icon:0,time:1000});
                            layer.close(index);
                        }
                    },
                    error:function(e){
                        console.log(e,e.message);
                        alert('error');
                    }
                });
            });
            return false;
        });

        form.on('submit(changePwdBtn)', function (data2) {
            var password1 = data2.field.password1,
                password2 = data2.field.password2;
            if(data2.field.password !== user.password){
                layer.msg("原始密码错误")
                return false;
            }
            if(password1 === password2 && checkPassword(password1)){
                user.password = password1;
                var index = layer.alert("是否确认修改密码", {
                    title: '修改信息'
                }, function () {
                    $.ajax({
                        url: "/user/updateDo",
                        data: JSON.stringify(user),
                        contentType: "application/json;charset=UTF-8",
                        dataType: "json",
                        type: "POST",
                        success: function (res) {
                            if (res.status === 200) {
                                layer.msg(res.message, {icon: 1, time: 1000});
                                layer.close(index);
                                // parent.layer.close(parentIndex);
                            } else {
                                layer.msg(res.message, {icon: 0, time: 1000});
                                layer.close(index);
                            }
                        },
                        error: function (e) {
                            console.log(e, e.message);
                            alert('error');
                        }
                    });
                })
            }else{
                layer.msg("请输入正确格式的密码并进行二次确认", {icon: 0, time: 1000});
            }
            return false;
        });
    });
</script>


